<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!--引入 element-ui 的样式，-->
    <link rel="stylesheet" href="/elementUI/index.css">
    <!-- 必须先引入vue，  后使用element-ui -->
    <script src="/elementUI/vue.js"></script>
    <!-- 引入element 的组件库-->
    <script src="/elementUI/index.js"></script>
</head>
<body>
<div>
    <div id="app">
        <p th:text="${hello}"></p>
        <el-button @click="sendGet()">按钮</el-button>
        <div style="">{{a}}---{{num}}秒</div>
        <div>
            <el-table
                    :data="tableData"
                    border
                    style="width: 100%">
                <el-table-column
                        prop="date"
                        label="日期"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="name"
                        label="姓名"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="地址">
                </el-table-column>
            </el-table>
        </div>
    </div>

</div>
<script>
    new Vue({
        el: '#app',
        data: function() {
            return {
                a:'成功引入Vue + element-ui',
                num:"",
                tableData: [{
                    date: '2016-05-02',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1517 弄'
                }],
            }
        },
        created(){
            this.fun()
        },
        methods:{
            send(){
                axios({
                    method:'get',
                    url:'http://192.168.10.32:9090/user/list'
                }).then(function(resp){
                    console.log(resp.data);
                }).catch(resp => {
                    console.log('请求失败：'+resp.status+','+resp.statusText);
                });
            },
            sendGet(){//格式b
                this.$axios.get('http://192.168.10.32:9090/user/list',
                    {}
                ).then(resp => {
                        console.log(resp.data);
                    }).catch(err => {             //
                    console.log('请求失败：'+err.status+','+err.statusText);
                });
            },
            fun(){
                setTimeout(()=>{
                    this.num+=1
                    this.fun()
                },1000)
            }
        }
    })
</script>
</body>
</html>
